<template>
  <div class="file">
    <!-- 文件列表 -->
        <el-button
          type="primary"
          round
          style="margin: 20px 0px" @click="goupload">上传</el-button>
    <el-form :inline="true" :model="query" class="demo-form-inline">
      <el-form-item label="每页展示文件数目">
        <el-select
          v-model="query.pageSize"
          placeholder="每页展示文件数目"
          @change="changesize"
        >
          <el-option label="5" value="5"></el-option>
          <el-option label="10" value="10"></el-option>
          <el-option label="20" value="20"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-table :data="pageBean.list" border style="width: 100%" height="330">
      <el-table-column prop="dname" label="文件名" width="580">
      </el-table-column>
      <el-table-column prop="dsize" label="大小" width="180"> </el-table-column>
      <el-table-column prop="ctime" label="创建日期"> </el-table-column>
      <el-table-column label="操作">
        <!-- 内部数据访问机制 -->
        <template slot-scope="scope">
          <a :href="  'http://localhost:8080/ky/download?filePath=' + scope.row.path">
            <i
              class="el-icon-download"
              style="color: red; font-size: 20px; cursor: pointer"
            ></i>
          </a>
        </template>
      </el-table-column>
    </el-table>
    <div class="datapage">
      <el-pagination
        background
        layout="prev, pager, next"
        :page-size="query.pageSize"
        :total="pageBean.total"
        @current-change="currentchange"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
import { myfilelist, subjectfilelist } from "../api/myReq";
export default {
    name:"File",
     data() {
    return {
      pageBean: {},
      query: {
        page: 1,
        pageSize: 5,
      },
    };
  },
  methods: {
    getUserFilelist(page, pageSize) {
      const uid = this.$store.state.user.id;
      this.query.page = page;
      this.query.pageSize = pageSize;
      myfilelist(uid, this.query).then((resp) => {
        const data = resp.data;
        //console.log(data);
        this.pageBean = data.data[0];
      });
    },
    //当前页改变
    currentchange(cindex) {
      //更新当前页的数据
      this.query.page = cindex;
      this.getFileList();
    },
    //当前查询数据改变
    changesize(csize) {
      this.query.pageSize = parseInt(csize);
      this.query.page = 1;
      this.getFileList();
    },
    getFileList() {
      if (this.sname) {
        //查询科目文件列表
        subjectfilelist(this.sname).then((resp) => {
          const data = resp.data;
          //console.log(data);
          this.pageBean = data.data[0];
        });
      } else {
        this.getUserFilelist(this.query.page, this.query.pageSize);
      }
    },
    goupload(){
        this.$router.push("/home/upload");
    }
  },
  created() {
    this.getFileList();
  },
};
</script>

<style>

</style>